<template>
  <div class="app-container">
    <Ht-search-form
      :dictMap="dictMap"
      :searchExtend="extendSearch"
      :queryParams="queryParams"
      :outputQueryParams="queryParams"
      :formOptions="formOptions"
      :advOptions="[]"
      permission="user:postInfo:view"
    ></Ht-search-form>

    <!-- 表格数据 -->
    <ht-table
      ref="dataTable"
      :multi-select="true"
      :dictMap="dictMap"
      :queryParams="queryParams"
      :tableBindColumns="tableBindColumns"
      :extendColumns="extendColumns"
      :reqConfig="regConfig"
      :uploadServiceName="'authorityFileService'"
    >
      <template v-slot:operate>
        <el-table-column
          :label="$t('common.operate')"
          align="center"
          width="130"
          fixed="right"
        >
          <template slot-scope="scope">
            <el-button
              v-if="scope.row.reviewStatus==='0'"
              size="mini"
              type="text"
              @click="handleUpdate(scope.row)"
              v-hasPermi="['user:postInfo:edit']"
              >审核
            </el-button>

            <el-button
              v-else
              size="mini"
              type="text"
              @click="handleUpdate(scope.row)"
              v-hasPermi="['user:postInfo:edit']"
            >详情
            </el-button>

          </template>
        </el-table-column>
      </template>
    </ht-table>

    <!-- 添加或修改弹出框 -->
    <el-dialog
      :title="title"
      center
      :visible.sync="open"
      width="1024px"
      append-to-body
      @close="close()"
    >
      <el-form
        ref="addForm"
        :model="addForm"
        label-width="110px"
        :disabled="true"
      >

        <el-card class="form-card txnInfo-card">
          <div slot="header" class="label-header-msg">
            <span>基础数据变化</span>
          </div>
          <el-table
            :data="addForm.compareFields"
            :cell-class-name="tableCellClassName"
            style="width: 100%"
          >
            <el-table-column label="属性名" prop="desc"></el-table-column>
            <el-table-column label="修改前" prop="originValue"></el-table-column>
            <el-table-column label="修改后" prop="newValue"></el-table-column>
          </el-table>
        </el-card>
        <el-card class="form-card txnInfo-card">
          <div slot="header" class="label-header-msg">
            <span>审核信息</span>
          </div>
          <el-row type="flex">
            <el-col :span="12">
              <el-form-item label="操作类型" prop="opType">
                <el-select style="width: 100%;" v-model="addForm.opType" placeholder="操作类型">
                  <el-option
                    v-for="dict in dictMap.OP_TYPE"
                    :key="dict.value"
                    :label="`${dict.value}-${dict.text}`"
                    :value="dict.value"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row type="flex">
            <el-col :span="12">
              <el-form-item label="操作者" prop="createBy">
                <el-input v-model="addForm.createBy" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="操作时间" prop="mdTime">
                <el-date-picker style="width: 100%;" v-model="addForm.createTime" value-format="yyyyMMddHHmmss"
                                type="datetime"
                />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row type="flex">
            <el-col :span="12">
              <el-form-item label="审核状态" prop="reviewStatus">
                <el-select style="width: 100%;" v-model="addForm.reviewStatus" placeholder="审核状态">
                  <el-option
                    v-for="dict in dictMap.REVIEW_STATUS"
                    :key="dict.value"
                    :label="`${dict.value}-${dict.text}`"
                    :value="dict.value"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row type="flex">
            <el-col :span="12">
              <el-form-item label="审核者" prop="reviewBy">
                <el-input v-model="addForm.reviewBy" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="审核时间" prop="reviewTime">
                <el-date-picker style="width: 100%;" v-model="addForm.reviewTime" value-format="yyyyMMddHHmmss"
                                type="datetime"
                />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row type="flex">
            <el-col >
              <el-form-item label="备注" prop="remark">
                <el-input v-model="addForm.remark" type="textarea" maxlength="256"/>
              </el-form-item>
            </el-col>
          </el-row>
        </el-card>

      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="approve" v-if="this.addForm.reviewStatus==='0'">审 核</el-button>
        <el-button type="danger" @click="reject" v-if="this.addForm.reviewStatus==='0'" >拒 绝</el-button>
        <el-button @click="cancel">{{ $t("common.cancel") }}</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { property } from "@/api/authority_app/base";
import {
  apiUrlConfig,
  approve,
  reject,
} from "@/api/authority_app/post/postInfoApprove";
import { listPageMixin } from "@/libs/listPageMixin";

export default {
  name: "RoleInfoApprove",
  components: {},
  mixins: [listPageMixin],
  data() {
    return {
      entryTable:'entryTable',
      mutiTeanant: false,
      // 弹出层标题
      title: "",
      //遮罩层
      loading: false,
      // 是否显示弹出层
      searchFormDictList: ['OP_TYPE','REVIEW_STATUS', 'sys_normal_disable'],
      open: false,
      //菜单权限
      treeData: [],
      //级联关系
      defaultProps: {
        label: "name",
        children: "children",
      },
      tenantOptions: [],
      // 表单参数
      addForm: {
        roleName: "",
        roleKey: "",
        status: "1",
        remark: "",
        roleSort: "",
        tenantCode: "",
        menuIds: [],
        expandValueInfoMap: {},
      },

      // 当前勾选菜单ID
      checkedKeys: [],
      // 原勾选菜单ID
      originCheckedKeys: [],

      extendParentKey: "3",

      formOptions: [],
      // 查询参数
      queryParams: {
        current: 1,
        limit: 10,
        roleName: "",
        reviewStatus:"0",
        roleKey: "",
        status: "",
      },
      regConfig: apiUrlConfig,

      isAble: false,
      tenantCodeIsAble: false,
      tableBindDetailColumns:[
        {label:'属性名',prop:'desc'},
        {label:'修改前',prop:'originValue'},
        {label:'修改后',prop:'newValue'},
      ],
      // 列信息
      tableBindColumns: [
        {
          label: this.$t("authority.postInfo.form.id"),
          prop: "id",
          visible: false,
        },
        {
          label: this.$t("authority.postInfo.form.postCode"),
          prop: "postCode",
        },
        {
          label: this.$t("authority.postInfo.form.postName"),
          prop: "postName",
        },
        { label: '操作类型', prop: "opType",dictCode:'OP_TYPE'},
        { label: '操作者', prop: 'createBy'},
        { label: '操作时间' , prop:'createTime'},
        { label: '审核状态', prop: 'reviewStatus',dictCode: 'REVIEW_STATUS'}



      ],

      searchExtendColumns: [],
    };
  },
  mounted() {

    const formOptions = [
      {
        type: "input",
        prop: "postName",
        defaultAttr: {
          size: "small",
          label: this.$t("authority.postInfo.form.postName"),
          placeholder: this.$t("authority.postInfo.form.postName"),
        },
      },
      {
        type: "dict",
        dict: "REVIEW_STATUS",
        prop: "reviewStatus",
        defaultAttr: {
          size: "small",
          label: '审核状态',
          placeholder: '审核状态',
        },
      },
    ];
    this.formOptions = formOptions;
  },
  methods: {
    getDictReq(dictCode) {
      return this.getDicts(dictCode);
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.$set(this, "addForm", {
        roleName: "",
        roleKey: "",
        status: "1",
        remark: "",
        roleSort: "",
        menuIds: [],
        expandValueInfoMap: {},
      });
      // this.resetForm("addForm");
      // this.$refs.htExtendForm.clearInput();
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.id);
      this.single = selection.length !== 1;
      this.multiple = !selection.length;
    },
    refreshTreeData(tenantCode) {
      this.allMenuTreeNew(tenantCode);
    },

    /** 审核详情按钮操作 */
    handleUpdate: function (row) {
      this.resetForm("addForm");
      this.open = true;
      this.title = "岗位审核";
      this.addForm.id = row.id;
      this.addForm.tenantCode = row.tenantCode
      this.addForm.reviewId= row.reviewId
      this.addForm.compareFields=row.reviewCompareInfo===undefined?'':JSON.parse(row.reviewCompareInfo);
      this.addForm.expandValueInfoMap = row.expandValueInfoMap || {};
      this.addForm.opType=row.opType;
      this.addForm.createBy=row.createBy;
      this.addForm.createTime=row.createTime;
      this.addForm.reviewStatus=row.reviewStatus;
      this.addForm.reviewBy=row.reviewBy;
      this.addForm.reviewTime=row.reviewTime;
      this.addForm.remark=row.remark;
      // 状态数据字典转换
      const statusMap = new Map(this.dictMap.sys_normal_disable.map(val => [val.value, val.text]))
      this.addForm.compareFields.forEach(compareField => {
        if (compareField.name === "status") {
          compareField.newValue = statusMap.get(compareField.newValue);
          compareField.originValue = statusMap.get(compareField.originValue);
        }
      })
      // checkRoleUpdatePermission(row.tenantCode).then((response) => {
      //   this.isAble = !response.result;
      //   this.tenantCodeIsAble = !response.result;
      // });

    },



    // 取消按钮
    close() {
      this.open = false;
    },



    tableCellClassName({ row, column, rowIndex, columnIndex }) {
      if (columnIndex > 0 && row.changeFlag == "1") {
        return "warning-cell";
      } else {
        return "";
      }
    },


    //审核通过按钮
    approve() {
      this.$refs["addForm"].validate((valid) => {
        if (valid) {
          this.loading = true;
          approve(this.addForm)
            .then((response) => {
              this.msgSuccess("审核通过");
              this.open = false;
              this.loading = false;
              this.$nextTick(() => {
                this.$refs.dataTable.doQuery(true);
              });
            })
            .catch((err) => {
              this.loading = false;
            });
        }
      });
    },
    //审核拒绝按钮
    reject() {
      this.$refs["addForm"].validate((valid) => {
        if (valid) {
          this.loading = true;
          reject(this.addForm)
            .then((response) => {
              this.msgSuccess("审核拒绝");
              this.open = false;
              this.loading = false;
              this.$nextTick(() => {
                this.$refs.dataTable.doQuery(true);
              });
            })
            .catch((err) => {
              this.loading = false;
            });
        }
      });
    },
  },
};
</script>
<style>
.tree-container {
  max-height: 350px;
  overflow: auto;
}
.el-table .warning-cell {
  color: red;
}

.label-header-msg {
  font-weight: bold;
}

.form-card {
  margin-bottom: 10px;
}
</style>
